<!DOCTYPE html>
<html lang="en-gb" dir="ltr">

    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>Icon component - UIkit documentation</title>
        <link rel="shortcut icon" href="images/favicon.ico" type="image/x-icon">
        <link rel="apple-touch-icon-precomposed" href="images/apple-touch-icon.png">
        <link id="data-uikit-theme" rel="stylesheet" href="css/uikit.docs.min.css">
        <link rel="stylesheet" href="css/docs.css">
        <link rel="stylesheet" href="../vendor/highlight/highlight.css">
        <script src="../vendor/jquery.js"></script>
        <script src="js/uikit.min.js"></script>
        <script src="../vendor/highlight/highlight.js"></script>
        <script src="js/docs.js"></script>
    </head>

    <body class="tm-background">

        <nav class="tm-navbar uk-navbar uk-navbar-attached">
            <div class="uk-container uk-container-center">

                <a class="uk-navbar-brand uk-hidden-small" href="../index.html"><img class="uk-margin uk-margin-remove" src="images/logo_uikit.svg" width="90" height="30" title="UIkit" alt="UIkit"></a>

                <ul class="uk-navbar-nav uk-hidden-small">
                    <li><a href="documentation_get-started.html">Get Started</a></li>
                    <li class="uk-active"><a href="core.html">Core</a></li>
                    <li><a href="components.html">Components</a></li>
                    <li><a href="customizer.html">Customizer</a></li>
                    <li><a href="../showcase/index.html">Showcase</a></li>
                    <li><a href="tutorials.html">Tutorials</a></li>
                    <li><a href="uikit3.html">UIkit 3</a></li>
                </ul>

                <a href="#tm-offcanvas" class="uk-navbar-toggle uk-visible-small" data-uk-offcanvas></a>

                <div class="uk-navbar-brand uk-navbar-center uk-visible-small"><img src="images/logo_uikit.svg" width="90" height="30" title="UIkit" alt="UIkit"></div>

            </div>
        </nav>

        <div class="tm-middle">
            <div class="uk-container uk-container-center">

                <div class="uk-grid" data-uk-grid-margin>
                    <div class="tm-sidebar uk-width-medium-1-4 uk-hidden-small">

                        <ul class="tm-nav uk-nav" data-uk-nav>

                            <li class="uk-nav-header">Defaults</li>
                            <li><a href="base.html">Base</a></li>
                            <li><a href="print.html">Print</a></li>

                            <li class="uk-nav-header">Layout</li>
                            <li><a href="grid.html">Grid</a></li>
                            <li><a href="panel.html">Panel</a></li>
                            <li><a href="block.html">Block</a></li>
                            <li><a href="article.html">Article</a></li>
                            <li><a href="comment.html">Comment</a></li>
                            <li><a href="utility.html">Utility</a></li>
                            <li><a href="flex.html">Flex</a></li>
                            <li><a href="cover.html">Cover</a></li>

                            <li class="uk-nav-header">Navigations</li>
                            <li><a href="nav.html">Nav</a></li>
                            <li><a href="navbar.html">Navbar</a></li>
                            <li><a href="subnav.html">Subnav</a></li>
                            <li><a href="breadcrumb.html">Breadcrumb</a></li>
                            <li><a href="pagination.html">Pagination</a></li>
                            <li><a href="tab.html">Tab</a></li>
                            <li><a href="thumbnav.html">Thumbnav</a></li>

                            <li class="uk-nav-header">Elements</li>
                            <li><a href="list.html">List</a></li>
                            <li><a href="description-list.html">Description list</a></li>
                            <li><a href="table.html">Table</a></li>
                            <li><a href="form.html">Form</a></li>

                            <li class="uk-nav-header">Common</li>
                            <li><a href="button.html">Button</a></li>
                            <li class="uk-active"><a href="icon.html">Icon</a></li>
                            <li><a href="close.html">Close</a></li>
                            <li><a href="badge.html">Badge</a></li>
                            <li><a href="alert.html">Alert</a></li>
                            <li><a href="thumbnail.html">Thumbnail</a></li>
                            <li><a href="overlay.html">Overlay</a></li>
                            <li><a href="text.html">Text</a></li>
                            <li><a href="column.html">Column</a></li>
                            <li><a href="animation.html">Animation</a></li>
                            <li><a href="contrast.html">Contrast</a></li>

                            <li class="uk-nav-header">JavaScript</li>
                            <li><a href="dropdown.html">Dropdown</a></li>
                            <li><a href="modal.html">Modal</a></li>
                            <li><a href="offcanvas.html">Off-canvas</a></li>
                            <li><a href="switcher.html">Switcher</a></li>
                            <li><a href="toggle.html">Toggle</a></li>
                            <li><a href="scrollspy.html">Scrollspy</a></li>
                            <li><a href="smooth-scroll.html">Smooth scroll</a></li>

                        </ul>

                    </div>
                    <div class="tm-main uk-width-medium-3-4">

                        <article class="uk-article">

                            <h1 class="uk-article-title">Icon</h1>

                            <p class="uk-article-lead">Place vector icons anywhere using an icon font.</p>

                            <p>This component is using the fantastic <a href="http://fortawesome.github.com/Font-Awesome/">Font Awesome</a> icon font, a project by Dave Gandy. Altogether Font Awesome provides more than 300 symbols and glyphs for web-related actions. Icon fonts are great, because they enable you to easily change color, size and more via CSS. They are scalable vector graphics, which means that they look great on high-resolution displays.</p>

                            <hr class="uk-article-divider">

                            <h2 id="usage"><a href="#usage" class="uk-link-reset">Usage</a></h2>

                            <p>To apply this component, add any <code>.uk-icon-*</code> class to an <code>&lt;i&gt;</code> or <code>&lt;span&gt;</code> element. Et voilà, you have a vector icon, which inherits size and color just like your text does.</p>

                            <h3 class="tm-article-subtitle">Examples</h3>

                            <ul class="uk-width-medium-1-3 uk-list uk-list-line">
                                <li><i class="uk-icon-cog"></i> Uses the <code>.uk-icon-cog</code> class</li>
                                <li><i class="uk-icon-user"></i> Uses the <code>.uk-icon-user</code> class</li>
                                <li><i class="uk-icon-home"></i> Uses the <code>.uk-icon-home</code> class</li>
                                <li><a href="#"><i class="uk-icon-external-link"></i> An icon in a link</a></li>
                            </ul>

                            <a href="#" class="uk-button"><i class="uk-icon-envelope-o"></i> A button with an icon</a>

                            <h3 class="tm-article-subtitle">Markup</h3>

<pre><code>&lt;!-- This is an icon --&gt;
&lt;i class="uk-icon-cog"&gt;&lt;/i&gt;

&lt;!-- This is an icon in a link --&gt;
&lt;a href=""&gt;&lt;i class="uk-icon-cog"&gt;&lt;/i&gt; ...&lt;/a&gt;</code></pre>

                            <hr class="uk-article-divider">

                            <h2 id="more-examples"><a href="#more-examples" class="uk-link-reset">More examples</a></h2>

                            <h3>Button group</h3>

                            <p>This example shows a group of buttons from the <a href="button.html">Button component</a> with icons inside each button.</p>

                            <h4 class="tm-article-subtitle">Example</h4>

                            <div class="uk-button-group">
                                <a href="#" class="uk-button"><i class="uk-icon-fast-backward"></i></a>
                                <a href="#" class="uk-button"><i class="uk-icon-stop"></i></a>
                                <a href="#" class="uk-button"><i class="uk-icon-play"></i></a>
                                <a href="#" class="uk-button"><i class="uk-icon-fast-forward"></i></a>
                            </div>

                            <hr class="uk-article-divider">

                            <h3>Button dropdown</h3>

                            <p>This example shows a button which is split into a standard action to the left and a dropdown toggle on the right, using the <a href="dropdown.html">Dropdown component</a>.</p>

                            <h4 class="tm-article-subtitle">Example</h4>

                            <div class="uk-button-group">
                                <button class="uk-button uk-button-primary"><i class="uk-icon-folder-open"></i> Post</button>
                                <div data-uk-dropdown="{mode:'click'}">
                                    <button class="uk-button uk-button-primary"><i class="uk-icon-caret-down"></i></button>
                                    <div class="uk-dropdown uk-dropdown-small">
                                        <ul class="uk-nav uk-nav-dropdown">
                                            <li><a href="#"><i class="uk-icon-edit"></i> Edit</a></li>
                                            <li><a href="#"><i class="uk-icon-eye"></i> View</a></li>
                                            <li><a href="#"><i class="uk-icon-check-square-o"></i> Enable</a></li>
                                            <li class="uk-nav-divider"></li>
                                            <li><a href="#"><i class="uk-icon-trash-o"></i> Trash</a></li>
                                        </ul>
                                    </div>
                                </div>
                            </div>

                            <hr class="uk-article-divider">

                            <h3>Blockquotes</h3>

                            <p>This example shows a blockquote from the <a href="base.html">Base component</a> with a large quote icon. It also uses the <code>.uk-align-left</code> class from the <a href="utility.html">Utility component</a>.</p>

                            <h4 class="tm-article-subtitle">Example</h4>

                            <blockquote>
                                <p><i class="uk-icon-quote-left uk-icon-large uk-align-left"></i>The &lt;blockquote&gt; element defines a long quotation which also creates a new block by inserting white space before and after the blockquote element.</p>
                            </blockquote>

                            <hr class="uk-article-divider">

                            <h2 id="size-modifiers"><a href="#size-modifiers" class="uk-link-reset">Size modifiers</a></h2>

                            <p>Add the <code>.uk-icon-small</code>, <code>.uk-icon-medium</code> or <code>.uk-icon-large</code> class to an icon to make the it larger.</p>

                            <ul class="uk-list uk-list-space">
                                <li><i class="uk-icon-home"></i> This is the default size.</li>
                                <li><i class="uk-icon-home uk-icon-small"></i> This icon uses the <code>.uk-icon-small</code> class.</li>
                                <li><i class="uk-icon-home uk-icon-medium"></i> This icon uses the <code>.uk-icon-medium</code> class.</li>
                                <li><i class="uk-icon-home uk-icon-large"></i> This icon uses the <code>.uk-icon-large</code> class.</li>
                            </ul>

                            <hr class="uk-article-divider">

                            <h2 id="spin-modifier"><a href="#spin-modifier" class="uk-link-reset">Spin modifier</a></h2>

                            <p>Add the <code>.uk-icon-spin</code> class to create animated spinning icons.</p>

                            <ul class="uk-list uk-list-space">
                                <li><i class="uk-icon-spinner uk-icon-spin"></i> Spinner icon for loading content ... </li>
                                <li><i class="uk-icon-refresh uk-icon-spin"></i> Refresh icon for refreshing content ... </li>
                            </ul>

                            <hr class="uk-article-divider">

                            <h2 id="icon-hover"><a href="#icon-hover" class="uk-link-reset">Icon hover</a></h2>

                            <p>Use the modifier <code>.uk-icon-hover</code> class to use an anchor as an icon, applying a hover effect and removing the link underline.</p>

                            <h3 class="tm-article-subtitle">Example</h3>

                            <a href="#" class="uk-icon-small uk-icon-hover uk-icon-github"></a>
                            <a href="#" class="uk-icon-small uk-icon-hover uk-icon-twitter"></a>
                            <a href="#" class="uk-icon-small uk-icon-hover uk-icon-dribbble"></a>
                            <a href="#" class="uk-icon-small uk-icon-hover uk-icon-html5"></a>

                            <h3 class="tm-article-subtitle">Markup</h3>

<pre><code>&lt;a href="" class="uk-icon-hover uk-icon-github"&gt;&lt;/a&gt;</code></pre>

                            <hr class="uk-article-divider">

                            <h2 id="icon-button"><a href="#icon-button" class="uk-link-reset">Icon button</a></h2>

                            <p>Use the modifier <code>.uk-icon-button</code> class to create an icon button, which can be used perfectly for social icons.</p>

                            <h3 class="tm-article-subtitle">Example</h3>

                            <a href="#" class="uk-icon-button uk-icon-github"></a>
                            <a href="#" class="uk-icon-button uk-icon-twitter"></a>
                            <a href="#" class="uk-icon-button uk-icon-dribbble"></a>
                            <a href="#" class="uk-icon-button uk-icon-html5"></a>

                            <h3 class="tm-article-subtitle">Markup</h3>

<pre><code>&lt;a href="" class="uk-icon-button uk-icon-github"&gt;&lt;/a&gt;</code></pre>

                            <hr class="uk-article-divider">

                            <h2 id="justify-icon"><a href="#justify-icon" class="uk-link-reset">Justify icon</a></h2>

                            <p>To add a fixed width to the icon and center it, add the <code>.uk-icon-justify</code> class. This is useful when using different icons in a list.</p>

                            <h3 class="tm-article-subtitle">Example</h3>

                            <ul class="uk-list uk-list-space">
                                <li><i class="uk-icon-justify uk-icon-github"></i> Justified icon</li>
                                <li><i class="uk-icon-justify uk-icon-flash"></i> Justified icon</li>
                                <li><i class="uk-icon-justify uk-icon-folder-o"></i> Justified icon</li>
                                <li><i class="uk-icon-justify uk-icon-user"></i> Justified icon</li>
                            </ul>

                            <h3 class="tm-article-subtitle">Markup</h3>

<pre><code>&lt;a href="" class="uk-icon-justify uk-icon-github"&gt;&lt;/a&gt;</code></pre>

                            <hr class="uk-article-divider">

                            <h2 id="icon-mapping"><a href="#icon-mapping" class="uk-link-reset">Icon mapping</a></h2>

                            <p>Here is an overview of all available <code>.uk-icon-*</code> classes provided by <a href="http://fortawesome.github.com/Font-Awesome/">Font Awesome</a>.</p>

                            <h3>Web Application Icons</h3>

                            <ul class="uk-grid uk-grid-width-1-2 uk-grid-width-medium-1-4 tm-icons">
                                <li><i class="uk-icon-adjust"></i> adjust</li>
                                <li><i class="uk-icon-anchor"></i> anchor</li>
                                <li><i class="uk-icon-archive"></i> archive</li>
                                <li><i class="uk-icon-area-chart"></i> area-chart</li>
                                <li><i class="uk-icon-arrows"></i> arrows</li>
                                <li><i class="uk-icon-arrows-h"></i> arrows-h</li>
                                <li><i class="uk-icon-arrows-v"></i> arrows-v</li>
                                <li><i class="uk-icon-asterisk"></i> asterisk</li>
                                <li><i class="uk-icon-at"></i> at</li>
                                <li><i class="uk-icon-automobile"></i> automobile <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-balance-scale"></i> balance-scale</li>
                                <li><i class="uk-icon-ban"></i> ban</li>
                                <li><i class="uk-icon-bank"></i> bank <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-bar-chart"></i> bar-chart</li>
                                <li><i class="uk-icon-bar-chart-o"></i> bar-chart-o <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-barcode"></i> barcode</li>
                                <li><i class="uk-icon-bars"></i> bars</li>
                                <li><i class="uk-icon-battery-empty"></i> battery-empty <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-battery-0"></i> battery-0</li>
                                <li><i class="uk-icon-battery-quarter"></i> battery-quarter <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-battery-1"></i> battery-1</li>
                                <li><i class="uk-icon-battery-half"></i> battery-half <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-battery-2"></i> battery-2</li>
                                <li class="uk-text-truncate"><i class="uk-icon-battery-three-quarters"></i> battery-three-quarters <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-battery-3"></i> battery-3</li>
                                <li><i class="uk-icon-battery-full"></i> battery-full <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-battery-4"></i> battery-4</li>
                                <li><i class="uk-icon-bed"></i> bed</li>
                                <li><i class="uk-icon-beer"></i> beer</li>
                                <li><i class="uk-icon-bell"></i> bell</li>
                                <li><i class="uk-icon-bell-o"></i> bell-o</li>
                                <li><i class="uk-icon-bell-slash"></i> bell-slash</li>
                                <li><i class="uk-icon-bell-slash-o"></i> bell-slash-o</li>
                                <li><i class="uk-icon-bicycle"></i> bicycle</li>
                                <li><i class="uk-icon-binoculars"></i> binoculars</li>
                                <li><i class="uk-icon-birthday-cake"></i> birthday-cake</li>
                                <li><i class="uk-icon-bluetooth"></i> bluetooth</li>
                                <li><i class="uk-icon-bluetooth-b"></i> bluetooth-b</li>
                                <li><i class="uk-icon-bolt"></i> bolt</li>
                                <li><i class="uk-icon-bomb"></i> bomb</li>
                                <li><i class="uk-icon-book"></i> book</li>
                                <li><i class="uk-icon-bookmark"></i> bookmark</li>
                                <li><i class="uk-icon-bookmark-o"></i> bookmark-o</li>
                                <li><i class="uk-icon-briefcase"></i> briefcase</li>
                                <li><i class="uk-icon-bug"></i> bug</li>
                                <li><i class="uk-icon-building"></i> building</li>
                                <li><i class="uk-icon-building-o"></i> building-o</li>
                                <li><i class="uk-icon-bullhorn"></i> bullhorn</li>
                                <li><i class="uk-icon-bullseye"></i> bullseye</li>
                                <li><i class="uk-icon-bus"></i> bus</li>
                                <li><i class="uk-icon-cab"></i> cab <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-calculator"></i> calculator</li>
                                <li><i class="uk-icon-calendar"></i> calendar</li>
                                <li><i class="uk-icon-calendar-check-o"></i> calendar-check-o</li>
                                <li><i class="uk-icon-calendar-minus-o"></i> calendar-minus-o</li>
                                <li><i class="uk-icon-calendar-o"></i> calendar-o</li>
                                <li><i class="uk-icon-calendar-plus-o"></i> calendar-plus-o</li>
                                <li><i class="uk-icon-calendar-times-o"></i> calendar-times-o</li>
                                <li><i class="uk-icon-camera"></i> camera</li>
                                <li><i class="uk-icon-camera-retro"></i> camera-retro</li>
                                <li><i class="uk-icon-car"></i> car</li>
                                <li><i class="uk-icon-caret-square-o-down"></i> caret-square-o-down</li>
                                <li><i class="uk-icon-caret-square-o-left"></i> caret-square-o-left</li>
                                <li><i class="uk-icon-caret-square-o-right"></i> caret-square-o-right</li>
                                <li><i class="uk-icon-caret-square-o-up"></i> caret-square-o-up</li>
                                <li><i class="uk-icon-cart-arrow-down"></i> cart-arrow-down</li>
                                <li><i class="uk-icon-cart-plus"></i> cart-plus</li>
                                <li><i class="uk-icon-cc"></i> cc</li>
                                <li><i class="uk-icon-certificate"></i> certificate</li>
                                <li><i class="uk-icon-check"></i> check</li>
                                <li><i class="uk-icon-check-circle"></i> check-circle</li>
                                <li><i class="uk-icon-check-circle-o"></i> check-circle-o</li>
                                <li><i class="uk-icon-check-square"></i> check-square</li>
                                <li><i class="uk-icon-check-square-o"></i> check-square-o</li>
                                <li><i class="uk-icon-child"></i> child</li>
                                <li><i class="uk-icon-circle"></i> circle</li>
                                <li><i class="uk-icon-circle-o"></i> circle-o</li>
                                <li><i class="uk-icon-circle-o-notch"></i> circle-o-notch</li>
                                <li><i class="uk-icon-circle-thin"></i> circle-thin</li>
                                <li><i class="uk-icon-clock-o"></i> clock-o</li>
                                <li><i class="uk-icon-clone"></i> clone</li>
                                <li><i class="uk-icon-close"></i> close <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-cloud"></i> cloud</li>
                                <li><i class="uk-icon-cloud-download"></i> cloud-download</li>
                                <li><i class="uk-icon-cloud-upload"></i> cloud-upload</li>
                                <li><i class="uk-icon-code"></i> code</li>
                                <li><i class="uk-icon-code-fork"></i> code-fork</li>
                                <li><i class="uk-icon-coffee"></i> coffee</li>
                                <li><i class="uk-icon-cog"></i> cog</li>
                                <li><i class="uk-icon-cogs"></i> cogs</li>
                                <li><i class="uk-icon-comment"></i> comment</li>
                                <li><i class="uk-icon-comment-o"></i> comment-o</li>
                                <li><i class="uk-icon-commenting"></i> commenting</li>
                                <li><i class="uk-icon-commenting-o"></i> commenting-o</li>
                                <li><i class="uk-icon-comments"></i> comments</li>
                                <li><i class="uk-icon-comments-o"></i> comments-o</li>
                                <li><i class="uk-icon-compass"></i> compass</li>
                                <li><i class="uk-icon-copyright"></i> copyright</li>
                                <li><i class="uk-icon-creative-commons"></i> creative-commons</li>
                                <li><i class="uk-icon-credit-card"></i> credit-card</li>
                                <li><i class="uk-icon-credit-card-alt"></i> credit-card-alt</li>
                                <li><i class="uk-icon-crop"></i> crop</li>
                                <li><i class="uk-icon-crosshairs"></i> crosshairs</li>
                                <li><i class="uk-icon-cube"></i> cube</li>
                                <li><i class="uk-icon-cubes"></i> cubes</li>
                                <li><i class="uk-icon-cutlery"></i> cutlery</li>
                                <li><i class="uk-icon-dashboard"></i> dashboard <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-database"></i> database</li>
                                <li><i class="uk-icon-desktop"></i> desktop</li>
                                <li><i class="uk-icon-diamond"></i> diamond</li>
                                <li><i class="uk-icon-dot-circle-o"></i> dot-circle-o</li>
                                <li><i class="uk-icon-download"></i> download</li>
                                <li><i class="uk-icon-edit"></i> edit <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-ellipsis-h"></i> ellipsis-h</li>
                                <li><i class="uk-icon-ellipsis-v"></i> ellipsis-v</li>
                                <li><i class="uk-icon-envelope"></i> envelope</li>
                                <li><i class="uk-icon-envelope-o"></i> envelope-o</li>
                                <li><i class="uk-icon-envelope-square"></i> envelope-square</li>
                                <li><i class="uk-icon-eraser"></i> eraser</li>
                                <li><i class="uk-icon-exchange"></i> exchange</li>
                                <li><i class="uk-icon-exclamation"></i> exclamation</li>
                                <li><i class="uk-icon-exclamation-circle"></i> exclamation-circle</li>
                                <li><i class="uk-icon-exclamation-triangle"></i> exclamation-triangle</li>
                                <li><i class="uk-icon-external-link"></i> external-link</li>
                                <li><i class="uk-icon-external-link-square"></i> external-link-square</li>
                                <li><i class="uk-icon-eye"></i> eye</li>
                                <li><i class="uk-icon-eye-slash"></i> eye-slash</li>
                                <li><i class="uk-icon-eyedropper"></i> eyedropper</li>
                                <li><i class="uk-icon-fax"></i> fax</li>
                                <li><i class="uk-icon-female"></i> female</li>
                                <li><i class="uk-icon-fighter-jet"></i> fighter-jet</li>
                                <li><i class="uk-icon-file-archive-o"></i> file-archive-o</li>
                                <li><i class="uk-icon-file-audio-o"></i> file-audio-o</li>
                                <li><i class="uk-icon-file-code-o"></i> file-code-o</li>
                                <li><i class="uk-icon-file-excel-o"></i> file-excel-o</li>
                                <li><i class="uk-icon-file-image-o"></i> file-image-o</li>
                                <li><i class="uk-icon-file-movie-o"></i> file-movie-o <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-file-pdf-o"></i> file-pdf-o</li>
                                <li><i class="uk-icon-file-photo-o"></i> file-photo-o <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-file-picture-o"></i> file-picture-o <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-file-powerpoint-o"></i> file-powerpoint-o</li>
                                <li><i class="uk-icon-file-sound-o"></i> file-sound-o <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-file-video-o"></i> file-video-o</li>
                                <li><i class="uk-icon-file-word-o"></i> file-word-o</li>
                                <li><i class="uk-icon-file-zip-o"></i> file-zip-o <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-film"></i> film</li>
                                <li><i class="uk-icon-filter"></i> filter</li>
                                <li><i class="uk-icon-fire"></i> fire</li>
                                <li><i class="uk-icon-fire-extinguisher"></i> fire-extinguisher</li>
                                <li><i class="uk-icon-flag"></i> flag</li>
                                <li><i class="uk-icon-flag-checkered"></i> flag-checkered</li>
                                <li><i class="uk-icon-flag-o"></i> flag-o</li>
                                <li><i class="uk-icon-flash"></i> flash <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-flask"></i> flask</li>
                                <li><i class="uk-icon-folder"></i> folder</li>
                                <li><i class="uk-icon-folder-o"></i> folder-o</li>
                                <li><i class="uk-icon-folder-open"></i> folder-open</li>
                                <li><i class="uk-icon-folder-open-o"></i> folder-open-o</li>
                                <li><i class="uk-icon-frown-o"></i> frown-o</li>
                                <li><i class="uk-icon-futbol-o"></i> futbol-o</li>
                                <li><i class="uk-icon-gamepad"></i> gamepad</li>
                                <li><i class="uk-icon-gavel"></i> gavel</li>
                                <li><i class="uk-icon-gear"></i> gear <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-gears"></i> gears <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-genderless"></i> genderless <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-gift"></i> gift</li>
                                <li><i class="uk-icon-glass"></i> glass</li>
                                <li><i class="uk-icon-globe"></i> globe</li>
                                <li><i class="uk-icon-graduation-cap"></i> graduation-cap</li>
                                <li><i class="uk-icon-group"></i> group <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-hand-lizard-o"></i> hand-lizard-o</li>
                                <li><i class="uk-icon-hand-stop-o"></i> hand-stop-o <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-hand-paper-o"></i> hand-paper-o</li>
                                <li><i class="uk-icon-hand-peace-o"></i> hand-peace-o</li>
                                <li><i class="uk-icon-hand-pointer-o"></i> hand-pointer-o</li>
                                <li><i class="uk-icon-hand-grab-o"></i> hand-grab-o <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-hand-rock-o"></i> hand-rock-o</li>
                                <li><i class="uk-icon-hand-scissors-o"></i> hand-scissors-o</li>
                                <li><i class="uk-icon-hand-spock-o"></i> hand-spock-o</li>
                                <li><i class="uk-icon-hdd-o"></i> hdd-o</li>
                                <li><i class="uk-icon-hashtag"></i> hashtag</li>
                                <li><i class="uk-icon-headphones"></i> headphones</li>
                                <li><i class="uk-icon-heart"></i> heart</li>
                                <li><i class="uk-icon-heart-o"></i> heart-o</li>
                                <li><i class="uk-icon-heartbeat"></i> heartbeat</li>
                                <li><i class="uk-icon-history"></i> history</li>
                                <li><i class="uk-icon-home"></i> home</li>
                                <li><i class="uk-icon-hotel"></i> hotel <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-hourglass"></i> hourglass</li>
                                <li><i class="uk-icon-hourglass-o"></i> hourglass-o</li>
                                <li><i class="uk-icon-hourglass-1"></i> hourglass-1 <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-hourglass-start"></i> hourglass-start</li>
                                <li><i class="uk-icon-hourglass-2"></i> hourglass-2 <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-hourglass-half"></i> hourglass-half</li>
                                <li><i class="uk-icon-hourglass-3"></i> hourglass-3 <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-hourglass-end"></i> hourglass-end</li>
                                <li><i class="uk-icon-i-cursor"></i> i-cursor</li>
                                <li><i class="uk-icon-image"></i> image <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-inbox"></i> inbox</li>
                                <li><i class="uk-icon-industry"></i> industry</li>
                                <li><i class="uk-icon-info"></i> info</li>
                                <li><i class="uk-icon-info-circle"></i> info-circle</li>
                                <li><i class="uk-icon-institution"></i> institution <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-key"></i> key</li>
                                <li><i class="uk-icon-keyboard-o"></i> keyboard-o</li>
                                <li><i class="uk-icon-language"></i> language</li>
                                <li><i class="uk-icon-laptop"></i> laptop</li>
                                <li><i class="uk-icon-leaf"></i> leaf</li>
                                <li><i class="uk-icon-legal"></i> legal <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-lemon-o"></i> lemon-o</li>
                                <li><i class="uk-icon-level-down"></i> level-down</li>
                                <li><i class="uk-icon-level-up"></i> level-up</li>
                                <li><i class="uk-icon-life-bouy"></i> life-bouy <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-life-buoy"></i> life-buoy <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-life-ring"></i> life-ring</li>
                                <li><i class="uk-icon-life-saver"></i> life-saver <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-lightbulb-o"></i> lightbulb-o</li>
                                <li><i class="uk-icon-line-chart"></i> line-chart</li>
                                <li><i class="uk-icon-location-arrow"></i> location-arrow</li>
                                <li><i class="uk-icon-lock"></i> lock</li>
                                <li><i class="uk-icon-magic"></i> magic</li>
                                <li><i class="uk-icon-magnet"></i> magnet</li>
                                <li><i class="uk-icon-mail-forward"></i> mail-forward <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-mail-reply"></i> mail-reply <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-mail-reply-all"></i> mail-reply-all <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-male"></i> male</li>
                                <li><i class="uk-icon-map"></i> map</li>
                                <li><i class="uk-icon-map-marker"></i> map-marker</li>
                                <li><i class="uk-icon-map-o"></i> map-o</li>
                                <li><i class="uk-icon-map-pin"></i> map-pin</li>
                                <li><i class="uk-icon-map-signs"></i> map-signs</li>
                                <li><i class="uk-icon-meh-o"></i> meh-o</li>
                                <li><i class="uk-icon-microphone"></i> microphone</li>
                                <li><i class="uk-icon-microphone-slash"></i> microphone-slash</li>
                                <li><i class="uk-icon-minus"></i> minus</li>
                                <li><i class="uk-icon-minus-circle"></i> minus-circle</li>
                                <li><i class="uk-icon-minus-square"></i> minus-square</li>
                                <li><i class="uk-icon-minus-square-o"></i> minus-square-o</li>
                                <li><i class="uk-icon-mobile"></i> mobile</li>
                                <li><i class="uk-icon-mobile-phone"></i> mobile-phone <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-money"></i> money</li>
                                <li><i class="uk-icon-moon-o"></i> moon-o</li>
                                <li><i class="uk-icon-mortar-board"></i> mortar-board <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-motorcycle"></i> motorcycle</li>
                                <li><i class="uk-icon-mouse-pointer"></i> mouse-pointer</li>
                                <li><i class="uk-icon-music"></i> music</li>
                                <li><i class="uk-icon-navicon"></i> navicon <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-newspaper-o"></i> newspaper-o</li>
                                <li><i class="uk-icon-object-group"></i> object-group</li>
                                <li><i class="uk-icon-object-ungroup"></i> object-ungroup</li>
                                <li><i class="uk-icon-paint-brush"></i> paint-brush</li>
                                <li><i class="uk-icon-paper-plane"></i> paper-plane</li>
                                <li><i class="uk-icon-paper-plane-o"></i> paper-plane-o</li>
                                <li><i class="uk-icon-paw"></i> paw</li>
                                <li><i class="uk-icon-pencil"></i> pencil</li>
                                <li><i class="uk-icon-pencil-square"></i> pencil-square</li>
                                <li><i class="uk-icon-pencil-square-o"></i> pencil-square-o</li>
                                <li><i class="uk-icon-percent"></i> percent</li>
                                <li><i class="uk-icon-phone"></i> phone</li>
                                <li><i class="uk-icon-phone-square"></i> phone-square</li>
                                <li><i class="uk-icon-photo"></i> photo <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-picture-o"></i> picture-o</li>
                                <li><i class="uk-icon-pie-chart"></i> pie-chart</li>
                                <li><i class="uk-icon-plane"></i> plane</li>
                                <li><i class="uk-icon-plug"></i> plug</li>
                                <li><i class="uk-icon-plus"></i> plus</li>
                                <li><i class="uk-icon-plus-circle"></i> plus-circle</li>
                                <li><i class="uk-icon-plus-square"></i> plus-square</li>
                                <li><i class="uk-icon-plus-square-o"></i> plus-square-o</li>
                                <li><i class="uk-icon-power-off"></i> power-off</li>
                                <li><i class="uk-icon-print"></i> print</li>
                                <li><i class="uk-icon-puzzle-piece"></i> puzzle-piece</li>
                                <li><i class="uk-icon-qrcode"></i> qrcode</li>
                                <li><i class="uk-icon-question"></i> question</li>
                                <li><i class="uk-icon-question-circle"></i> question-circle</li>
                                <li><i class="uk-icon-quote-left"></i> quote-left</li>
                                <li><i class="uk-icon-quote-right"></i> quote-right</li>
                                <li><i class="uk-icon-random"></i> random</li>
                                <li><i class="uk-icon-recycle"></i> recycle</li>
                                <li><i class="uk-icon-refresh"></i> refresh</li>
                                <li><i class="uk-icon-registered"></i> registered</li>
                                <li><i class="uk-icon-remove"></i> remove <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-reorder"></i> reorder <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-reply"></i> reply</li>
                                <li><i class="uk-icon-reply-all"></i> reply-all</li>
                                <li><i class="uk-icon-retweet"></i> retweet</li>
                                <li><i class="uk-icon-road"></i> road</li>
                                <li><i class="uk-icon-rocket"></i> rocket</li>
                                <li><i class="uk-icon-rss"></i> rss</li>
                                <li><i class="uk-icon-rss-square"></i> rss-square</li>
                                <li><i class="uk-icon-search"></i> search</li>
                                <li><i class="uk-icon-search-minus"></i> search-minus</li>
                                <li><i class="uk-icon-search-plus"></i> search-plus</li>
                                <li><i class="uk-icon-send"></i> send <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-send-o"></i> send-o <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-server"></i> server</li>
                                <li><i class="uk-icon-share"></i> share</li>
                                <li><i class="uk-icon-share-alt"></i> share-alt</li>
                                <li><i class="uk-icon-share-alt-square"></i> share-alt-square</li>
                                <li><i class="uk-icon-share-square"></i> share-square</li>
                                <li><i class="uk-icon-share-square-o"></i> share-square-o</li>
                                <li><i class="uk-icon-shield"></i> shield</li>
                                <li><i class="uk-icon-ship"></i> ship</li>
                                <li><i class="uk-icon-shopping-bag"></i> shopping-bag</li>
                                <li><i class="uk-icon-shopping-basket"></i> shopping-basket</li>
                                <li><i class="uk-icon-shopping-cart"></i> shopping-cart</li>
                                <li><i class="uk-icon-sign-in"></i> sign-in</li>
                                <li><i class="uk-icon-sign-out"></i> sign-out</li>
                                <li><i class="uk-icon-signal"></i> signal</li>
                                <li><i class="uk-icon-sitemap"></i> sitemap</li>
                                <li><i class="uk-icon-sliders"></i> sliders</li>
                                <li><i class="uk-icon-smile-o"></i> smile-o</li>
                                <li><i class="uk-icon-soccer-ball-o"></i> soccer-ball-o <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-sort"></i> sort</li>
                                <li><i class="uk-icon-sort-alpha-asc"></i> sort-alpha-asc</li>
                                <li><i class="uk-icon-sort-alpha-desc"></i> sort-alpha-desc</li>
                                <li><i class="uk-icon-sort-amount-asc"></i> sort-amount-asc</li>
                                <li><i class="uk-icon-sort-amount-desc"></i> sort-amount-desc</li>
                                <li><i class="uk-icon-sort-asc"></i> sort-asc</li>
                                <li><i class="uk-icon-sort-desc"></i> sort-desc</li>
                                <li><i class="uk-icon-sort-down"></i> sort-down <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-sort-numeric-asc"></i> sort-numeric-asc</li>
                                <li><i class="uk-icon-sort-numeric-desc"></i> sort-numeric-desc</li>
                                <li><i class="uk-icon-sort-up"></i> sort-up <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-space-shuttle"></i> space-shuttle</li>
                                <li><i class="uk-icon-spinner"></i> spinner</li>
                                <li><i class="uk-icon-spoon"></i> spoon</li>
                                <li><i class="uk-icon-square"></i> square</li>
                                <li><i class="uk-icon-square-o"></i> square-o</li>
                                <li><i class="uk-icon-star"></i> star</li>
                                <li><i class="uk-icon-star-half"></i> star-half</li>
                                <li><i class="uk-icon-star-half-empty"></i> star-half-empty <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-star-half-full"></i> star-half-full <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-star-half-o"></i> star-half-o</li>
                                <li><i class="uk-icon-star-o"></i> star-o</li>
                                <li><i class="uk-icon-sticky-note"></i> sticky-note</li>
                                <li><i class="uk-icon-sticky-note-o"></i> sticky-note-o</li>
                                <li><i class="uk-icon-street-view"></i> street-view</li>
                                <li><i class="uk-icon-suitcase"></i> suitcase</li>
                                <li><i class="uk-icon-sun-o"></i> sun-o</li>
                                <li><i class="uk-icon-support"></i> support <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-tablet"></i> tablet</li>
                                <li><i class="uk-icon-tachometer"></i> tachometer</li>
                                <li><i class="uk-icon-tag"></i> tag</li>
                                <li><i class="uk-icon-tags"></i> tags</li>
                                <li><i class="uk-icon-tasks"></i> tasks</li>
                                <li><i class="uk-icon-taxi"></i> taxi</li>
                                <li><i class="uk-icon-television"></i> television</li>
                                <li><i class="uk-icon-terminal"></i> terminal</li>
                                <li><i class="uk-icon-thumb-tack"></i> thumb-tack</li>
                                <li><i class="uk-icon-thumbs-down"></i> thumbs-down</li>
                                <li><i class="uk-icon-thumbs-o-down"></i> thumbs-o-down</li>
                                <li><i class="uk-icon-thumbs-o-up"></i> thumbs-o-up</li>
                                <li><i class="uk-icon-thumbs-up"></i> thumbs-up</li>
                                <li><i class="uk-icon-ticket"></i> ticket</li>
                                <li><i class="uk-icon-times"></i> times</li>
                                <li><i class="uk-icon-times-circle"></i> times-circle</li>
                                <li><i class="uk-icon-times-circle-o"></i> times-circle-o</li>
                                <li><i class="uk-icon-tint"></i> tint</li>
                                <li><i class="uk-icon-toggle-down"></i> toggle-down <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-toggle-left"></i> toggle-left <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-toggle-off"></i> toggle-off</li>
                                <li><i class="uk-icon-toggle-on"></i> toggle-on</li>
                                <li><i class="uk-icon-toggle-right"></i> toggle-right <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-toggle-up"></i> toggle-up <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-trademark"></i> trademark</li>
                                <li><i class="uk-icon-trash"></i> trash</li>
                                <li><i class="uk-icon-trash-o"></i> trash-o</li>
                                <li><i class="uk-icon-tree"></i> tree</li>
                                <li><i class="uk-icon-trophy"></i> trophy</li>
                                <li><i class="uk-icon-truck"></i> truck</li>
                                <li><i class="uk-icon-tty"></i> tty</li>
                                <li><i class="uk-icon-tv"></i> tv <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-umbrella"></i> umbrella</li>
                                <li><i class="uk-icon-university"></i> university</li>
                                <li><i class="uk-icon-unlock"></i> unlock</li>
                                <li><i class="uk-icon-unlock-alt"></i> unlock-alt</li>
                                <li><i class="uk-icon-unsorted"></i> unsorted <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-upload"></i> upload</li>
                                <li><i class="uk-icon-usb"></i> usb</li>
                                <li><i class="uk-icon-user"></i> user</li>
                                <li><i class="uk-icon-user-plus"></i> user-plus</li>
                                <li><i class="uk-icon-user-secret"></i> user-secret</li>
                                <li><i class="uk-icon-user-times"></i> user-times</li>
                                <li><i class="uk-icon-users"></i> users</li>
                                <li><i class="uk-icon-video-camera"></i> video-camera</li>
                                <li><i class="uk-icon-volume-down"></i> volume-down</li>
                                <li><i class="uk-icon-volume-off"></i> volume-off</li>
                                <li><i class="uk-icon-volume-up"></i> volume-up</li>
                                <li><i class="uk-icon-warning"></i> warning <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-wheelchair"></i> wheelchair</li>
                                <li><i class="uk-icon-wifi"></i> wifi</li>
                                <li><i class="uk-icon-wrench"></i> wrench</li>
                            </ul>

                            <hr class="uk-article-divider">

                            <h3>Transportation Icons</h3>

                            <ul class="uk-grid uk-grid-width-1-2 uk-grid-width-medium-1-4 tm-icons">
                                <li><i class="uk-icon-ambulance"></i> ambulance</li>
                                <li><i class="uk-icon-automobile"></i> automobile <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-bicycle"></i> bicycle</li>
                                <li><i class="uk-icon-bus"></i> bus</li>
                                <li><i class="uk-icon-cab"></i> cab <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-car"></i> car</li>
                                <li><i class="uk-icon-fighter-jet"></i> fighter-jet</li>
                                <li><i class="uk-icon-motorcycle"></i> motorcycle</li>
                                <li><i class="uk-icon-plane"></i> plane</li>
                                <li><i class="uk-icon-rocket"></i> rocket</li>
                                <li><i class="uk-icon-ship"></i> ship</li>
                                <li><i class="uk-icon-space-shuttle"></i> space-shuttle</li>
                                <li><i class="uk-icon-subway"></i> subway</li>
                                <li><i class="uk-icon-taxi"></i> taxi</li>
                                <li><i class="uk-icon-train"></i> train</li>
                                <li><i class="uk-icon-truck"></i> truck</li>
                                <li><i class="uk-icon-wheelchair"></i> wheelchair</li>
                            </ul>

                            <hr class="uk-article-divider">

                            <h3>Accessibility Icons</h3>

                            <ul class="uk-grid uk-grid-width-1-2 uk-grid-width-medium-1-4 tm-icons">
                                <li><i class="uk-icon-american-sign-language-interpreting"></i> american-sign-language-interpreting</li>
                                <li><i class="uk-icon-asl-interpreting"></i> asl-interpreting <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-assistive-listening-systems"></i> assistive-listening-systems</li>
                                <li><i class="uk-icon-audio-description"></i> audio-description</li>
                                <li><i class="uk-icon-blind"></i> blind</li>
                                <li><i class="uk-icon-braille"></i> braille</li>
                                <li><i class="uk-icon-cc"></i> cc</li>
                                <li><i class="uk-icon-deaf"></i> deaf</li>
                                <li><i class="uk-icon-deafness"></i> deafness <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-hard-of-hearing"></i> hard-of-hearing <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-low-vision"></i> low-vision</li>
                                <li><i class="uk-icon-question-circle-o"></i> question-circle-o</li>
                                <li><i class="uk-icon-sign-language"></i> sign-language</li>
                                <li><i class="uk-icon-signing"></i> signing <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-tty"></i> tty</li>
                                <li><i class="uk-icon-universal-access"></i> universal-access</li>
                                <li><i class="uk-icon-volume-control-phone"></i> volume-control-phone</li>
                                <li><i class="uk-icon-wheelchair"></i> wheelchair</li>
                                <li><i class="uk-icon-wheelchair-alt"></i> wheelchair-alt</li>
                            </ul>



                            <h3>Hand Icons</h3>

                            <ul class="uk-grid uk-grid-width-1-2 uk-grid-width-medium-1-4 tm-icons">
                                <li><i class="uk-icon-hand-lizard-o"></i> hand-lizard-o</li>
                                <li><i class="uk-icon-hand-stop-o"></i> hand-stop-o <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-hand-paper-o"></i> hand-paper-o</li>
                                <li><i class="uk-icon-hand-peace-o"></i> hand-peace-o</li>
                                <li><i class="uk-icon-hand-pointer-o"></i> hand-pointer-o</li>
                                <li><i class="uk-icon-hand-grab-o"></i> hand-grab-o <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-hand-rock-o"></i> hand-rock-o</li>
                                <li><i class="uk-icon-hand-scissors-o"></i> hand-scissors-o</li>
                                <li><i class="uk-icon-hand-spock-o"></i> hand-spock-o</li>
                                <li><i class="uk-icon-thumb-tack"></i> thumb-tack</li>
                                <li><i class="uk-icon-thumbs-down"></i> thumbs-down</li>
                                <li><i class="uk-icon-thumbs-o-down"></i> thumbs-o-down</li>
                                <li><i class="uk-icon-thumbs-o-up"></i> thumbs-o-up</li>
                                <li><i class="uk-icon-thumbs-up"></i> thumbs-up</li>
                            </ul>

                            <hr class="uk-article-divider">

                            <h3>Gender Icons</h3>

                            <ul class="uk-grid uk-grid-width-1-2 uk-grid-width-medium-1-4 tm-icons">
                                <li><i class="uk-icon-genderless"></i> genderless <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-mars"></i> mars</li>
                                <li><i class="uk-icon-mars-double"></i> mars-double</li>
                                <li><i class="uk-icon-mars-stroke"></i> mars-stroke</li>
                                <li><i class="uk-icon-mars-stroke-h"></i> mars-stroke-h</li>
                                <li><i class="uk-icon-mars-stroke-v"></i> mars-stroke-v</li>
                                <li><i class="uk-icon-mercury"></i> mercury</li>
                                <li><i class="uk-icon-neuter"></i> neuter</li>
                                <li><i class="uk-icon-transgender"></i> transgender</li>
                                <li><i class="uk-icon-transgender-alt"></i> transgender-alt</li>
                                <li><i class="uk-icon-venus"></i> venus</li>
                                <li><i class="uk-icon-venus-double"></i> venus-double</li>
                                <li><i class="uk-icon-venus-mars"></i> venus-mars</li>
                            </ul>

                            <hr class="uk-article-divider">

                            <h3>File Type Icons</h3>

                            <ul class="uk-grid uk-grid-width-1-2 uk-grid-width-medium-1-4 tm-icons">
                                <li><i class="uk-icon-file"></i> file</li>
                                <li><i class="uk-icon-file-archive-o"></i> file-archive-o</li>
                                <li><i class="uk-icon-file-audio-o"></i> file-audio-o</li>
                                <li><i class="uk-icon-file-code-o"></i> file-code-o</li>
                                <li><i class="uk-icon-file-excel-o"></i> file-excel-o</li>
                                <li><i class="uk-icon-file-image-o"></i> file-image-o</li>
                                <li><i class="uk-icon-file-movie-o"></i> file-movie-o <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-file-o"></i> file-o</li>
                                <li><i class="uk-icon-file-pdf-o"></i> file-pdf-o</li>
                                <li><i class="uk-icon-file-photo-o"></i> file-photo-o <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-file-picture-o"></i> file-picture-o <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-file-powerpoint-o"></i> file-powerpoint-o</li>
                                <li><i class="uk-icon-file-sound-o"></i> file-sound-o <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-file-text"></i> file-text</li>
                                <li><i class="uk-icon-file-text-o"></i> file-text-o</li>
                                <li><i class="uk-icon-file-video-o"></i> file-video-o</li>
                                <li><i class="uk-icon-file-word-o"></i> file-word-o</li>
                                <li><i class="uk-icon-file-zip-o"></i> file-zip-o <span class="uk-text-muted">(alias)</span></li>
                            </ul>

                            <hr class="uk-article-divider">

                            <h3>Spinner Icons</h3>

                            <ul class="uk-grid uk-grid-width-1-2 uk-grid-width-medium-1-4 tm-icons">
                                <li><i class="uk-icon-circle-o-notch"></i> circle-o-notch</li>
                                <li><i class="uk-icon-cog"></i> cog</li>
                                <li><i class="uk-icon-gear"></i> gear <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-refresh"></i> refresh</li>
                                <li><i class="uk-icon-spinner"></i> spinner<li>
                            </ul>

                            <hr class="uk-article-divider">

                            <h3>Form Control Icons</h3>

                            <ul class="uk-grid uk-grid-width-1-2 uk-grid-width-medium-1-4 tm-icons">
                                <li><i class="uk-icon-check-square"></i> check-square</li>
                                <li><i class="uk-icon-check-square-o"></i> check-square-o</li>
                                <li><i class="uk-icon-circle"></i> circle</li>
                                <li><i class="uk-icon-circle-o"></i> circle-o</li>
                                <li><i class="uk-icon-dot-circle-o"></i> dot-circle-o</li>
                                <li><i class="uk-icon-minus-square"></i> minus-square</li>
                                <li><i class="uk-icon-minus-square-o"></i> minus-square-o</li>
                                <li><i class="uk-icon-plus-square"></i> plus-square</li>
                                <li><i class="uk-icon-plus-square-o"></i> plus-square-o</li>
                                <li><i class="uk-icon-square"></i> square</li>
                                <li><i class="uk-icon-square-o"></i> square-o</li>
                            </ul>

                            <hr class="uk-article-divider">

                            <h3>Payment Icons</h3>

                            <ul class="uk-grid uk-grid-width-1-2 uk-grid-width-medium-1-4 tm-icons">
                                <li><i class="uk-icon-cc-amex"></i> cc-amex</li>
                                <li><i class="uk-icon-cc-diners-club"></i> cc-diners-club</li>
                                <li><i class="uk-icon-cc-discover"></i> cc-discover</li>
                                <li><i class="uk-icon-cc-jcb"></i> cc-jcb</li>
                                <li><i class="uk-icon-cc-mastercard"></i> cc-mastercard</li>
                                <li><i class="uk-icon-cc-paypal"></i> cc-paypal</li>
                                <li><i class="uk-icon-cc-stripe"></i> cc-stripe</li>
                                <li><i class="uk-icon-cc-visa"></i> cc-visa</li>
                                <li><i class="uk-icon-credit-card"></i> credit-card</li>
                                <li><i class="uk-icon-google-wallet"></i> google-wallet</li>
                                <li><i class="uk-icon-paypal"></i> paypal</li>
                            </ul>

                            <hr class="uk-article-divider">

                            <h3>Currency Icons</h3>

                            <ul class="uk-grid uk-grid-width-1-2 uk-grid-width-medium-1-4 tm-icons">
                                <li><i class="uk-icon-bitcoin"></i> bitcoin <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-btc"></i> btc</li>
                                <li><i class="uk-icon-cny"></i> cny <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-dollar"></i> dollar <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-eur"></i> eur</li>
                                <li><i class="uk-icon-euro"></i> euro <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-gbp"></i> gbp</li>
                                <li><i class="uk-icon-ils"></i> ils</li>
                                <li><i class="uk-icon-inr"></i> inr</li>
                                <li><i class="uk-icon-jpy"></i> jpy</li>
                                <li><i class="uk-icon-krw"></i> krw</li>
                                <li><i class="uk-icon-money"></i> money</li>
                                <li><i class="uk-icon-rmb"></i> rmb <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-rouble"></i> rouble <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-rub"></i> rub</li>
                                <li><i class="uk-icon-ruble"></i> ruble <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-rupee"></i> rupee <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-shekel"></i> shekel <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-sheqel"></i> sheqel <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-try"></i> try</li>
                                <li><i class="uk-icon-turkish-lira"></i> turkish-lira <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-usd"></i> usd</li>
                                <li><i class="uk-icon-won"></i> won <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-yen"></i> yen <span class="uk-text-muted">(alias)</span></li>
                            </ul>

                            <hr class="uk-article-divider">

                            <h3>Text Editor Icons</h3>

                            <ul class="uk-grid uk-grid-width-1-2 uk-grid-width-medium-1-4 tm-icons">
                                <li><i class="uk-icon-align-center"></i> align-center</li>
                                <li><i class="uk-icon-align-justify"></i> align-justify</li>
                                <li><i class="uk-icon-align-left"></i> align-left</li>
                                <li><i class="uk-icon-align-right"></i> align-right</li>
                                <li><i class="uk-icon-bold"></i> bold</li>
                                <li><i class="uk-icon-chain"></i> chain <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-chain-broken"></i> chain-broken</li>
                                <li><i class="uk-icon-clipboard"></i> clipboard</li>
                                <li><i class="uk-icon-columns"></i> columns</li>
                                <li><i class="uk-icon-copy"></i> copy <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-cut"></i> cut <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-dedent"></i> dedent <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-eraser"></i> eraser</li>
                                <li><i class="uk-icon-file"></i> file</li>
                                <li><i class="uk-icon-file-o"></i> file-o</li>
                                <li><i class="uk-icon-file-text"></i> file-text</li>
                                <li><i class="uk-icon-file-text-o"></i> file-text-o</li>
                                <li><i class="uk-icon-files-o"></i> files-o</li>
                                <li><i class="uk-icon-floppy-o"></i> floppy-o</li>
                                <li><i class="uk-icon-font"></i> font</li>
                                <li><i class="uk-icon-header"></i> header</li>
                                <li><i class="uk-icon-indent"></i> indent</li>
                                <li><i class="uk-icon-italic"></i> italic</li>
                                <li><i class="uk-icon-link"></i> link</li>
                                <li><i class="uk-icon-list"></i> list</li>
                                <li><i class="uk-icon-list-alt"></i> list-alt</li>
                                <li><i class="uk-icon-list-ol"></i> list-ol</li>
                                <li><i class="uk-icon-list-ul"></i> list-ul</li>
                                <li><i class="uk-icon-outdent"></i> outdent</li>
                                <li><i class="uk-icon-paperclip"></i> paperclip</li>
                                <li><i class="uk-icon-paragraph"></i> paragraph</li>
                                <li><i class="uk-icon-paste"></i> paste <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-repeat"></i> repeat</li>
                                <li><i class="uk-icon-rotate-left"></i> rotate-left <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-rotate-right"></i> rotate-right <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-save"></i> save <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-scissors"></i> scissors</li>
                                <li><i class="uk-icon-strikethrough"></i> strikethrough</li>
                                <li><i class="uk-icon-subscript"></i> subscript</li>
                                <li><i class="uk-icon-superscript"></i> superscript</li>
                                <li><i class="uk-icon-table"></i> table</li>
                                <li><i class="uk-icon-text-height"></i> text-height</li>
                                <li><i class="uk-icon-text-width"></i> text-width</li>
                                <li><i class="uk-icon-th"></i> th</li>
                                <li><i class="uk-icon-th-large"></i> th-large</li>
                                <li><i class="uk-icon-th-list"></i> th-list</li>
                                <li><i class="uk-icon-underline"></i> underline</li>
                                <li><i class="uk-icon-undo"></i> undo</li>
                                <li><i class="uk-icon-unlink"></i> unlink <span class="uk-text-muted">(alias)</span></li>
                            </ul>

                            <hr class="uk-article-divider">

                            <h3>Directional Icons</h3>

                            <ul class="uk-grid uk-grid-width-1-2 uk-grid-width-medium-1-4 tm-icons">
                                <li><i class="uk-icon-angle-double-down"></i> angle-double-down</li>
                                <li><i class="uk-icon-angle-double-left"></i> angle-double-left</li>
                                <li><i class="uk-icon-angle-double-right"></i> angle-double-right</li>
                                <li><i class="uk-icon-angle-double-up"></i> angle-double-up</li>
                                <li><i class="uk-icon-angle-down"></i> angle-down</li>
                                <li><i class="uk-icon-angle-left"></i> angle-left</li>
                                <li><i class="uk-icon-angle-right"></i> angle-right</li>
                                <li><i class="uk-icon-angle-up"></i> angle-up</li>
                                <li><i class="uk-icon-arrow-circle-down"></i> arrow-circle-down</li>
                                <li><i class="uk-icon-arrow-circle-left"></i> arrow-circle-left</li>
                                <li><i class="uk-icon-arrow-circle-o-down"></i> arrow-circle-o-down</li>
                                <li><i class="uk-icon-arrow-circle-o-left"></i> arrow-circle-o-left</li>
                                <li><i class="uk-icon-arrow-circle-o-right"></i> arrow-circle-o-right</li>
                                <li><i class="uk-icon-arrow-circle-o-up"></i> arrow-circle-o-up</li>
                                <li><i class="uk-icon-arrow-circle-right"></i> arrow-circle-right</li>
                                <li><i class="uk-icon-arrow-circle-up"></i> arrow-circle-up</li>
                                <li><i class="uk-icon-arrow-down"></i> arrow-down</li>
                                <li><i class="uk-icon-arrow-left"></i> arrow-left</li>
                                <li><i class="uk-icon-arrow-right"></i> arrow-right</li>
                                <li><i class="uk-icon-arrow-up"></i> arrow-up</li>
                                <li><i class="uk-icon-arrows"></i> arrows</li>
                                <li><i class="uk-icon-arrows-alt"></i> arrows-alt</li>
                                <li><i class="uk-icon-arrows-h"></i> arrows-h</li>
                                <li><i class="uk-icon-arrows-v"></i> arrows-v</li>
                                <li><i class="uk-icon-caret-down"></i> caret-down</li>
                                <li><i class="uk-icon-caret-left"></i> caret-left</li>
                                <li><i class="uk-icon-caret-right"></i> caret-right</li>
                                <li><i class="uk-icon-caret-square-o-down"></i> caret-square-o-down</li>
                                <li><i class="uk-icon-caret-square-o-left"></i> caret-square-o-left</li>
                                <li><i class="uk-icon-caret-square-o-right"></i> caret-square-o-right</li>
                                <li><i class="uk-icon-caret-square-o-up"></i> caret-square-o-up</li>
                                <li><i class="uk-icon-caret-up"></i> caret-up</li>
                                <li><i class="uk-icon-chevron-circle-down"></i> chevron-circle-down</li>
                                <li><i class="uk-icon-chevron-circle-left"></i> chevron-circle-left</li>
                                <li><i class="uk-icon-chevron-circle-right"></i> chevron-circle-right</li>
                                <li><i class="uk-icon-chevron-circle-up"></i> chevron-circle-up</li>
                                <li><i class="uk-icon-chevron-down"></i> chevron-down</li>
                                <li><i class="uk-icon-chevron-left"></i> chevron-left</li>
                                <li><i class="uk-icon-chevron-right"></i> chevron-right</li>
                                <li><i class="uk-icon-chevron-up"></i> chevron-up</li>
                                <li><i class="uk-icon-hand-o-down"></i> hand-o-down</li>
                                <li><i class="uk-icon-hand-o-left"></i> hand-o-left</li>
                                <li><i class="uk-icon-hand-o-right"></i> hand-o-right</li>
                                <li><i class="uk-icon-hand-o-up"></i> hand-o-up</li>
                                <li><i class="uk-icon-long-arrow-down"></i> long-arrow-down</li>
                                <li><i class="uk-icon-long-arrow-left"></i> long-arrow-left</li>
                                <li><i class="uk-icon-long-arrow-right"></i> long-arrow-right</li>
                                <li><i class="uk-icon-long-arrow-up"></i> long-arrow-up</li>
                                <li><i class="uk-icon-toggle-down"></i> toggle-down <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-toggle-left"></i> toggle-left <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-toggle-right"></i> toggle-right <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-toggle-up"></i> toggle-up <span class="uk-text-muted">(alias)</span></li>
                            </ul>

                            <hr class="uk-article-divider">

                            <h3>Video Player Icons</h3>

                            <ul class="uk-grid uk-grid-width-1-2 uk-grid-width-medium-1-4 tm-icons">
                                <li><i class="uk-icon-arrows-alt"></i> arrows-alt</li>
                                <li><i class="uk-icon-backward"></i> backward</li>
                                <li><i class="uk-icon-compress"></i> compress</li>
                                <li><i class="uk-icon-eject"></i> eject</li>
                                <li><i class="uk-icon-expand"></i> expand</li>
                                <li><i class="uk-icon-fast-backward"></i> fast-backward</li>
                                <li><i class="uk-icon-fast-forward"></i> fast-forward</li>
                                <li><i class="uk-icon-forward"></i> forward</li>
                                <li><i class="uk-icon-pause"></i> pause</li>
                                <li><i class="uk-icon-pause-circle"></i> pause-circle</li>
                                <li><i class="uk-icon-pause-circle-o"></i> pause-circle-o</li>
                                <li><i class="uk-icon-play"></i> play</li>
                                <li><i class="uk-icon-play-circle"></i> play-circle</li>
                                <li><i class="uk-icon-play-circle-o"></i> play-circle-o</li>
                                <li><i class="uk-icon-step-backward"></i> step-backward</li>
                                <li><i class="uk-icon-step-forward"></i> step-forward</li>
                                <li><i class="uk-icon-stop"></i> stop</li>
                                <li><i class="uk-icon-stop-circle"></i> stop-circle</li>
                                <li><i class="uk-icon-stop-circle-o"></i> stop-circle-o</li>
                                <li><i class="uk-icon-youtube-play"></i> youtube-play</li>
                            </ul>

                            <hr class="uk-article-divider">

                            <h3>Brand Icons</h3>

                            <ul class="uk-grid uk-grid-width-1-2 uk-grid-width-medium-1-4 tm-icons">
                                <li><i class="uk-icon-500px"></i> 500px</li>
                                <li><i class="uk-icon-adn"></i> adn</li>
                                <li><i class="uk-icon-amazon"></i> amazon</li>
                                <li><i class="uk-icon-android"></i> android</li>
                                <li><i class="uk-icon-angellist"></i> angellist</li>
                                <li><i class="uk-icon-apple"></i> apple</li>
                                <li><i class="uk-icon-behance"></i> behance</li>
                                <li><i class="uk-icon-behance-square"></i> behance-square</li>
                                <li><i class="uk-icon-bitbucket"></i> bitbucket</li>
                                <li><i class="uk-icon-bitbucket-square"></i> bitbucket-square</li>
                                <li><i class="uk-icon-bitcoin"></i> bitcoin <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-black-tie"></i> black-tie</li>
                                <li><i class="uk-icon-bluetooth"></i> bluetooth</li>
                                <li><i class="uk-icon-bluetooth-b"></i> bluetooth-b</li>
                                <li><i class="uk-icon-btc"></i> btc</li>
                                <li><i class="uk-icon-buysellads"></i> buysellads</li>
                                <li><i class="uk-icon-cc-amex"></i> cc-amex</li>
                                <li><i class="uk-icon-cc-diners-club"></i> cc-diners-club</li>
                                <li><i class="uk-icon-cc-discover"></i> cc-discover</li>
                                <li><i class="uk-icon-cc-jcb"></i> cc-jcb</li>
                                <li><i class="uk-icon-cc-mastercard"></i> cc-mastercard</li>
                                <li><i class="uk-icon-cc-paypal"></i> cc-paypal</li>
                                <li><i class="uk-icon-cc-stripe"></i> cc-stripe</li>
                                <li><i class="uk-icon-cc-visa"></i> cc-visa</li>
                                <li><i class="uk-icon-chrome"></i> chrome</li>
                                <li><i class="uk-icon-codepen"></i> codepen</li>
                                <li><i class="uk-icon-codiepie"></i> codiepie</li>
                                <li><i class="uk-icon-connectdevelop"></i> connectdevelop</li>
                                <li><i class="uk-icon-contao"></i> contao</li>
                                <li><i class="uk-icon-css3"></i> css3</li>
                                <li><i class="uk-icon-dashcube"></i> dashcube</li>
                                <li><i class="uk-icon-delicious"></i> delicious</li>
                                <li><i class="uk-icon-deviantart"></i> deviantart</li>
                                <li><i class="uk-icon-digg"></i> digg</li>
                                <li><i class="uk-icon-dribbble"></i> dribbble</li>
                                <li><i class="uk-icon-dropbox"></i> dropbox</li>
                                <li><i class="uk-icon-drupal"></i> drupal</li>
                                <li><i class="uk-icon-edge"></i> edge</li>
                                <li><i class="uk-icon-empire"></i> empire</li>
                                <li><i class="uk-icon-expeditedssl"></i> expeditedssl</li>
                                <li><i class="uk-icon-fa"></i> fa <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-facebook"></i> facebook</li>
                                <li><i class="uk-icon-facebook-f"></i> facebook-f <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-facebook-official"></i> facebook-official</li>
                                <li><i class="uk-icon-facebook-square"></i> facebook-square</li>
                                <li><i class="uk-icon-firefox"></i> firefox</li>
                                <li><i class="uk-icon-first-order"></i> first-order</li>
                                <li><i class="uk-icon-flickr"></i> flickr</li>
                                <li><i class="uk-icon-font-awesome"></i> font-awesome</li>
                                <li><i class="uk-icon-fonticons"></i> fonticons</li>
                                <li><i class="uk-icon-fort-awesome"></i> fort-awesome</li>
                                <li><i class="uk-icon-forumbee"></i> forumbee</li>
                                <li><i class="uk-icon-foursquare"></i> foursquare</li>
                                <li><i class="uk-icon-ge"></i> ge <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-get-pocket"></i> get-pocket</li>
                                <li><i class="uk-icon-gg"></i> gg</li>
                                <li><i class="uk-icon-gg-circle"></i> gg-circle</li>
                                <li><i class="uk-icon-git"></i> git</li>
                                <li><i class="uk-icon-git-square"></i> git-square</li>
                                <li><i class="uk-icon-github"></i> github</li>
                                <li><i class="uk-icon-github-alt"></i> github-alt</li>
                                <li><i class="uk-icon-github-square"></i> github-square</li>
                                <li><i class="uk-icon-gittip"></i> gittip <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-google"></i> google</li>
                                <li><i class="uk-icon-google-plus"></i> google-plus</li>
                                <li><i class="uk-icon-google-plus-square"></i> google-plus-square</li>
                                <li><i class="uk-icon-google-wallet"></i> google-wallet</li>
                                <li><i class="uk-icon-gratipay"></i> gratipay</li>
                                <li><i class="uk-icon-hacker-news"></i> hacker-news</li>
                                <li><i class="uk-icon-houzz"></i> houzz</li>
                                <li><i class="uk-icon-html5"></i> html5</li>
                                <li><i class="uk-icon-instagram"></i> instagram</li>
                                <li><i class="uk-icon-internet-explorer"></i> internet-explorer</li>
                                <li><i class="uk-icon-ioxhost"></i> ioxhost</li>
                                <li><i class="uk-icon-joomla"></i> joomla</li>
                                <li><i class="uk-icon-jsfiddle"></i> jsfiddle</li>
                                <li><i class="uk-icon-lastfm"></i> lastfm</li>
                                <li><i class="uk-icon-lastfm-square"></i> lastfm-square</li>
                                <li><i class="uk-icon-leanpub"></i> leanpub</li>
                                <li><i class="uk-icon-linkedin"></i> linkedin</li>
                                <li><i class="uk-icon-linkedin-square"></i> linkedin-square</li>
                                <li><i class="uk-icon-linux"></i> linux</li>
                                <li><i class="uk-icon-maxcdn"></i> maxcdn</li>
                                <li><i class="uk-icon-meanpath"></i> meanpath</li>
                                <li><i class="uk-icon-medium-logo"></i> medium-logo</li>
                                <li><i class="uk-icon-mixcloud"></i> mixcloud</li>
                                <li><i class="uk-icon-modx"></i> modx</li>
                                <li><i class="uk-icon-odnoklassniki"></i> odnoklassniki</li>
                                <li><i class="uk-icon-odnoklassniki-square"></i> odnoklassniki-square</li>
                                <li><i class="uk-icon-opencart"></i> opencart</li>
                                <li><i class="uk-icon-openid"></i> openid</li>
                                <li><i class="uk-icon-opera"></i> opera</li>
                                <li><i class="uk-icon-optin-monster"></i> optin-monster</li>
                                <li><i class="uk-icon-pagelines"></i> pagelines</li>
                                <li><i class="uk-icon-paypal"></i> paypal</li>
                                <li><i class="uk-icon-pied-piper"></i> pied-piper</li>
                                <li><i class="uk-icon-pied-piper-alt"></i> pied-piper-alt</li>
                                <li><i class="uk-icon-pinterest"></i> pinterest</li>
                                <li><i class="uk-icon-pinterest-p"></i> pinterest-p</li>
                                <li><i class="uk-icon-pinterest-square"></i> pinterest-square</li>
                                <li><i class="uk-icon-product-hunt"></i> product-hunt</li>
                                <li><i class="uk-icon-qq"></i> qq</li>
                                <li><i class="uk-icon-ra"></i> ra <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-rebel"></i> rebel</li>
                                <li><i class="uk-icon-reddit"></i> reddit</li>
                                <li><i class="uk-icon-reddit-alien"></i> reddit-alien</li>
                                <li><i class="uk-icon-reddit-square"></i> reddit-square</li>
                                <li><i class="uk-icon-renren"></i> renren</li>
                                <li><i class="uk-icon-safari"></i> safari</li>
                                <li><i class="uk-icon-scribd"></i> scribd</li>
                                <li><i class="uk-icon-sellsy"></i> sellsy</li>
                                <li><i class="uk-icon-share-alt"></i> share-alt</li>
                                <li><i class="uk-icon-share-alt-square"></i> share-alt-square</li>
                                <li><i class="uk-icon-shirtsinbulk"></i> shirtsinbulk</li>
                                <li><i class="uk-icon-simplybuilt"></i> simplybuilt</li>
                                <li><i class="uk-icon-skyatlas"></i> skyatlas</li>
                                <li><i class="uk-icon-skype"></i> skype</li>
                                <li><i class="uk-icon-slack"></i> slack</li>
                                <li><i class="uk-icon-slideshare"></i> slideshare</li>
                                <li><i class="uk-icon-soundcloud"></i> soundcloud</li>
                                <li><i class="uk-icon-spotify"></i> spotify</li>
                                <li><i class="uk-icon-stack-exchange"></i> stack-exchange</li>
                                <li><i class="uk-icon-stack-overflow"></i> stack-overflow</li>
                                <li><i class="uk-icon-steam"></i> steam</li>
                                <li><i class="uk-icon-steam-square"></i> steam-square</li>
                                <li><i class="uk-icon-stumbleupon"></i> stumbleupon</li>
                                <li><i class="uk-icon-stumbleupon-circle"></i> stumbleupon-circle</li>
                                <li><i class="uk-icon-tencent-weibo"></i> tencent-weibo</li>
                                <li><i class="uk-icon-themeisle"></i> themeisle</li>
                                <li><i class="uk-icon-trello"></i> trello</li>
                                <li><i class="uk-icon-tripadvisor"></i> tripadvisor</li>
                                <li><i class="uk-icon-tumblr"></i> tumblr</li>
                                <li><i class="uk-icon-tumblr-square"></i> tumblr-square</li>
                                <li><i class="uk-icon-twitch"></i> twitch</li>
                                <li><i class="uk-icon-twitter"></i> twitter</li>
                                <li><i class="uk-icon-twitter-square"></i> twitter-square</li>
                                <li><i class="uk-icon-usb"></i> usb</li>
                                <li><i class="uk-icon-viacoin"></i> viacoin</li>
                                <li><i class="uk-icon-vimeo"></i> vimeo</li>
                                <li><i class="uk-icon-vimeo-square"></i> vimeo-square</li>
                                <li><i class="uk-icon-vine"></i> vine</li>
                                <li><i class="uk-icon-vk"></i> vk</li>
                                <li><i class="uk-icon-wechat"></i> wechat <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-weibo"></i> weibo</li>
                                <li><i class="uk-icon-weixin"></i> weixin</li>
                                <li><i class="uk-icon-whatsapp"></i> whatsapp</li>
                                <li><i class="uk-icon-wikipedia-w"></i> wikipedia-w</li>
                                <li><i class="uk-icon-windows"></i> windows</li>
                                <li><i class="uk-icon-wordpress"></i> wordpress</li>
                                <li><i class="uk-icon-xing"></i> xing</li>
                                <li><i class="uk-icon-xing-square"></i> xing-square</li>
                                <li><i class="uk-icon-y-combinator"></i> y-combinator</li>
                                <li><i class="uk-icon-y-combinator-square"></i> y-combinator-square</li>
                                <li><i class="uk-icon-yahoo"></i> yahoo</li>
                                <li><i class="uk-icon-yc"></i> yc <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-yc-square"></i> yc-square <span class="uk-text-muted">(alias)</span></li>
                                <li><i class="uk-icon-yelp"></i> yelp</li>
                                <li><i class="uk-icon-yoast"></i> yoast</li>
                                <li><i class="uk-icon-youtube"></i> youtube</li>
                                <li><i class="uk-icon-youtube-play"></i> youtube-play</li>
                                <li><i class="uk-icon-youtube-square"></i> youtube-square</li>
                                <li><i class="uk-icon-glide"></i> glide</li>
                                <li><i class="uk-icon-glide-g"></i> glide-g</li>
                                <li><i class="uk-icon-snapchat"></i> snapchat</li>
                                <li><i class="uk-icon-snapchat-ghost"></i> snapchat-ghost</li>
                                <li><i class="uk-icon-snapchat-square"></i> snapchat-square</li>
                                <li><i class="uk-icon-viadeo"></i> viadeo</li>
                                <li><i class="uk-icon-viadeo-square"></i> viadeo-square</li>
                            </ul>

                            <hr class="uk-article-divider">

                            <h3>Medical Icons</h3>

                            <ul class="uk-grid uk-grid-width-1-2 uk-grid-width-medium-1-4 tm-icons">
                                <li><i class="uk-icon-ambulance"></i> ambulance</li>
                                <li><i class="uk-icon-h-square"></i> h-square</li>
                                <li><i class="uk-icon-hospital-o"></i> hospital-o</li>
                                <li><i class="uk-icon-medkit"></i> medkit</li>
                                <li><i class="uk-icon-plus-square"></i> plus-square</li>
                                <li><i class="uk-icon-stethoscope"></i> stethoscope</li>
                                <li><i class="uk-icon-user-md"></i> user-md</li>
                                <li><i class="uk-icon-wheelchair"></i> wheelchair</li>
                            </ul>

                        </article>

                    </div>
                </div>

            </div>
        </div>

        <div class="tm-footer">
            <div class="uk-container uk-container-center uk-text-center">

                <ul class="uk-subnav uk-subnav-line uk-flex-center">
                    <li><a href="http://github.com/uikit/uikit">GitHub</a></li>
                    <li><a href="http://github.com/uikit/uikit/issues">Issues</a></li>
                    <li><a href="http://github.com/uikit/uikit/blob/master/CHANGELOG.md">Changelog</a></li>
                    <li><a href="https://twitter.com/getuikit">Twitter</a></li>
                </ul>

                <div class="uk-panel">
                    <p>Made by <a href="http://www.yootheme.com">YOOtheme</a> with love and caffeine.<br>Licensed under <a href="http://opensource.org/licenses/MIT">MIT license</a>.</p>
                    <a href="../index.html"><img src="images/logo_uikit.svg" width="90" height="30" title="UIkit" alt="UIkit"></a>
                </div>

            </div>
        </div>

        <div id="tm-offcanvas" class="uk-offcanvas">

            <div class="uk-offcanvas-bar">

                <ul class="uk-nav uk-nav-offcanvas uk-nav-parent-icon" data-uk-nav="{multiple:true}">
                    <li class="uk-parent"><a href="#">Documentation</a>
                        <ul class="uk-nav-sub">
                            <li><a href="documentation_get-started.html">Get started</a></li>
                            <li><a href="documentation_how-to-customize.html">How to customize</a></li>
                            <li><a href="documentation_layouts.html">Layout examples</a></li>
                            <li><a href="core.html">Core</a></li>
                            <li><a href="components.html">Components</a></li>
                            <li><a href="documentation_project-structure.html">Project structure</a></li>
                            <li><a href="documentation_less-sass.html">Less &amp; Sass files</a></li>
                            <li><a href="documentation_create-a-theme.html">Create a theme</a></li>
                            <li><a href="documentation_create-a-style.html">Create a style</a></li>
                            <li><a href="documentation_customizer-json.html">Customizer.json</a></li>
                            <li><a href="documentation_javascript.html">JavaScript</a></li>
                            <li><a href="documentation_custom-prefix.html">Custom prefix</a></li>
                        </ul>
                    </li>
                    <li class="uk-nav-header">Core</li>
                    <li class="uk-parent"><a href="#"><i class="uk-icon-wrench"></i> Defaults</a>
                        <ul class="uk-nav-sub">
                            <li><a href="base.html">Base</a></li>
                            <li><a href="print.html">Print</a></li>
                        </ul>
                    </li>
                    <li class="uk-parent"><a href="#"><i class="uk-icon-th-large"></i> Layout</a>
                        <ul class="uk-nav-sub">
                            <li><a href="grid.html">Grid</a></li>
                            <li><a href="panel.html">Panel</a></li>
                            <li><a href="block.html">Block</a></li>
                            <li><a href="article.html">Article</a></li>
                            <li><a href="comment.html">Comment</a></li>
                            <li><a href="utility.html">Utility</a></li>
                            <li><a href="flex.html">Flex</a></li>
                            <li><a href="cover.html">Cover</a></li>
                        </ul>
                    </li>
                    <li class="uk-parent"><a href="#"><i class="uk-icon-bars"></i> Navigations</a>
                        <ul class="uk-nav-sub">
                            <li><a href="nav.html">Nav</a></li>
                            <li><a href="navbar.html">Navbar</a></li>
                            <li><a href="subnav.html">Subnav</a></li>
                            <li><a href="breadcrumb.html">Breadcrumb</a></li>
                            <li><a href="pagination.html">Pagination</a></li>
                            <li><a href="tab.html">Tab</a></li>
                            <li><a href="thumbnav.html">Thumbnav</a></li>
                        </ul>
                    </li>
                    <li class="uk-parent"><a href="#"><i class="uk-icon-check"></i> Elements</a>
                        <ul class="uk-nav-sub">
                            <li><a href="list.html">List</a></li>
                            <li><a href="description-list.html">Description list</a></li>
                            <li><a href="table.html">Table</a></li>
                            <li><a href="form.html">Form</a></li>
                        </ul>
                    </li>
                    <li class="uk-parent uk-active"><a href="#"><i class="uk-icon-folder-open"></i> Common</a>
                        <ul class="uk-nav-sub">
                            <li><a href="button.html">Button</a></li>
                            <li><a href="icon.html">Icon</a></li>
                            <li><a href="close.html">Close</a></li>
                            <li><a href="badge.html">Badge</a></li>
                            <li><a href="alert.html">Alert</a></li>
                            <li><a href="thumbnail.html">Thumbnail</a></li>
                            <li><a href="overlay.html">Overlay</a></li>
                            <li><a href="text.html">Text</a></li>
                            <li><a href="column.html">Column</a></li>
                            <li><a href="animation.html">Animation</a></li>
                            <li><a href="contrast.html">Contrast</a></li>
                        </ul>
                    </li>
                    <li class="uk-parent"><a href="#"><i class="uk-icon-magic"></i> JavaScript</a>
                        <ul class="uk-nav-sub">
                            <li><a href="dropdown.html">Dropdown</a></li>
                            <li><a href="modal.html">Modal</a></li>
                            <li><a href="offcanvas.html">Off-canvas</a></li>
                            <li><a href="switcher.html">Switcher</a></li>
                            <li><a href="toggle.html">Toggle</a></li>
                            <li><a href="scrollspy.html">Scrollspy</a></li>
                            <li><a href="smooth-scroll.html">Smooth scroll</a></li>
                        </ul>
                    </li>
                    <li class="uk-nav-header">Components</li>
                    <li class="uk-parent"><a href="#"><i class="uk-icon-th-large"></i> Layout</a>
                        <ul class="uk-nav-sub">
                            <li><a href="grid-js.html">Dynamic Grid</a></li>
                            <li><a href="grid-parallax.html">Parallax Grid</a></li>
                        </ul>
                    </li>
                    <li class="uk-parent"><a href="#"><i class="uk-icon-bars"></i> Navigations</a>
                        <ul class="uk-nav-sub">
                            <li><a href="dotnav.html">Dotnav</a></li>
                            <li><a href="slidenav.html">Slidenav</a></li>
                            <li><a href="pagination-js.html">Dynamic Pagination</a></li>
                        </ul>
                    </li>
                    <li class="uk-parent"><a href="#"><i class="uk-icon-folder-open"></i> Common</a>
                        <ul class="uk-nav-sub">
                            <li><a href="form-advanced.html">Form advanced</a></li>
                            <li><a href="form-file.html">Form file</a></li>
                            <li><a href="form-password.html">Form password</a></li>
                            <li><a href="form-select.html">Form select</a></li>
                            <li><a href="placeholder.html">Placeholder</a></li>
                            <li><a href="progress.html">Progress</a></li>
                        </ul>
                    </li>
                    <li class="uk-parent"><a href="#"><i class="uk-icon-magic"></i> JavaScript</a>
                        <ul class="uk-nav-sub">
                            <li><a href="lightbox.html">Lightbox</a></li>
                            <li><a href="autocomplete.html">Autocomplete</a></li>
                            <li><a href="datepicker.html">Datepicker</a></li>
                            <li><a href="htmleditor.html">HTML editor</a></li>
                            <li><a href="slider.html">Slider</a></li>
                            <li><a href="slideset.html">Slideset</a></li>
                            <li><a href="slideshow.html">Slideshow</a></li>
                            <li><a href="parallax.html">Parallax</a></li>
                            <li><a href="accordion.html">Accordion</a></li>
                            <li><a href="notify.html">Notify</a></li>
                            <li><a href="search.html">Search</a></li>
                            <li><a href="nestable.html">Nestable</a></li>
                            <li><a href="sortable.html">Sortable</a></li>
                            <li><a href="sticky.html">Sticky</a></li>
                            <li><a href="timepicker.html">Timepicker</a></li>
                            <li><a href="tooltip.html">Tooltip</a></li>
                            <li><a href="upload.html">Upload</a></li>
                        </ul>
                    </li>
                    <li class="uk-nav-divider"></li>
                    <li><a href="../showcase/index.html">Showcase</a></li>
                    <li><a href="tutorials.html">Tutorials</a></li>
                    <li><a href="uikit3.html">UIkit 3</a></li>
                </ul>

            </div>

        </div>

    </body>
</html>
